<!-- 活动台账-列表 -->
<template>
	<scroll-view class="list-scroll" scroll-y @scrolltolower="getList()" @refresherrefresh="getList(true)"
		:refresher-enabled="true" :refresher-triggered="refresherTriggered">
		<view class="list-box">
			<standing-book class="list-item" v-for="(item,index) in list" :key="item.id" :info="item"
				@refreshList="getList(true)">
			</standing-book>
			<view class="get-more" v-show="getMoreStatus">
				<text>正在加载更多。。。</text>
			</view>
			<empty-waybill v-show="list.length==0"></empty-waybill>
		</view>
	</scroll-view>
</template>

<script>
	import emptyWaybill from "@/components/tool-empty/waybill";
	import standingBook from '@/components/tool-card/standing-book';
	export default {
		components: {
			standingBook,
			emptyWaybill
		},
		data() {
			return {
				refresherTriggered: false,
				getMoreStatus: false,
				list: [],
				pages: {
					size: 10, // 每次加载的数量
					current: 1, // 记录当前页
					total: '', // 记录总数
				}
			};
		},
		computed: {
			refuseMore() {
				// 计算是否还有更多
				return this.pages.total === this.list.length;
			}
		},
		onLoad() {
			this.getList(true);
		},
		methods: {
			param(obj) {
				return JSON.stringify(obj);
			},
			// 监听点击右上角事件
			onNavigationBarButtonTap(e) {
				this.$goBack('./add');
			},
			// 加载，刷新
			getList(isRefresh) {
				// console.log(isRefresh)
				if (isRefresh) {
					this.list = [];
					this.refresherTriggered = true;
					this.pages.current = 1;
					this.pages.total = '';
				} else {
					if (this.refuseMore) {
						return false;
					}
					this.getMoreStatus = true;
					this.pages.current++;
				}
				// console.log(this.$store)
				const formData = {
					...this.pages
				};
				this.$api.mgntvehnotransPage(formData).then(res => {
					// console.log(res)
					const resData = res.data.data;
					// console.log(resData)
					if (isRefresh) {
						this.list = resData.records;
					} else {
						this.list = this.list.concat(resData.records);
					}
					this.pages.total = resData.total;
					this.refresherTriggered = false;
					this.getMoreStatus = false
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.list-scroll {
		height: calc(100vh - 5rpx);
	}

	.list-box {
		padding: 30rpx 20rpx 84rpx;
		position: relative;

		.get-more {
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			text-align: center;
			line-height: 4em;
			font-size: 28rpx;
			color: #666666;
		}

		.list-item {
			margin-bottom: 30rpx;
		}
	}
</style>
